/* HTML Page */
html {
background: #F9F9F9;
color: #333333;
font-family: "Lato", "Ubuntu", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 1;
width: 100%;
margin: 0px;
padding: 0px;
vertical-align: baseline;
}
* {
box-sizing: border-box;
}
.clear{
clear: both;
}
/* Main Page */
body {
margin:25px 0 0 0;
padding: 0px;
}
/* TOp Page */
.top-page {
position: relative;
background-color: #4B064B;
height: 80px;
width: 100%;
}
 .box {
position: relative;
margin: 0 auto;
max-width: 1132px;
background-color:red;
}
.box .site-logo {
position: absolute;
left: 50px;
top: -20px;
height: 120px;
width: 120px;
z-index: 9;
}
.box h1 {
display: none;
}
/* Top Menu CSS */
.menu,
	.menu ul,
	.menu li,
	.menu a {
		margin: 0;
		padding: 0;
		border: none;
		outline: none;
		z-index: 8;
	}
	 
	.menu {
		position: relative;
		top: 25px;
		height: 40px;
		width: 505px;
	 	float: right;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
	 
	.menu li {
		position: relative;
		list-style: none;
		float: left;
		display: block;
		height: 40px;
}
		
	.menu li a {
		display: block;
		padding: 0 14px;
		line-height: 28px;
		text-decoration: none;
	 
		border-left: 1px solid white;;
		border-right: 1px solid white;;
	 
		font-family: Helvetica, Arial, sans-serif;
		font-weight: bold;
		font-size: 13px;
	 	color: #f3f3f3;
	 	}
	 
	.menu li:first-child a { border-left: none; }
	.menu li:last-child a{ border-right: none; }
	 
	.menu li:hover > a { color: orange; }

	.menu ul {
		position: absolute;
		width: 140px;
		top: 40px;
		left: 0px;
	 	opacity: 0;
		background: white;
		border: 1px solid rgba(0, 0, 0, .3);
		border-radius:5px;
	}
	.menu ul:after {
	 content:"";
    width:0;
    height:0;
    position:absolute;
    border:10px solid transparent;;
    border-bottom: 10px solid white;
    top: -20px;
    left: 20px;

	}
	.menu ul a{color: black;}
	.menu li:hover > ul { opacity: 1; }
	 
	.menu ul li {
		height: 0;
		overflow: hidden;
		padding: 0;
	}
	 
	.menu li:hover > ul li {
		height: 36px;
		overflow: visible;
		padding: 0;
	}
	
	.menu ul li a {
		width: 100px;
		padding: 4px 0 4px 40px;
		margin: 0;
	 	border: none;
	}
	 
	.menu ul li:last-child a { border: none; }
	
	.menu a.css3 { background: url(docs.png) no-repeat 6px center; }
	.menu a.html5 { background: url(bubble.png) no-repeat 6px center; }
	.menu a.template { background: url(arrow.png) no-repeat 6px center; }
/*  */
.box .top-search {
float: right;
height: 100%;
}
.box .top-search form {
position: relative;
top: 25px;
}
.box .top-search form div{
display: inline-block;
vertical-align: top;
}
.box .top-search label{
display: none;
}
.box .top-search input {
border: 1px solid rgba(0, 0, 0, .3);
border-top-left-radius:10px;
border-bottom-left-radius:10px;
height:25px; 
width: 175px;
font-weight: 700;
font-size: 12px;
padding-left: 10px;
}
.box .top-search button {
border-top-right-radius:10px;
border-bottom-right-radius:10px;
background-color: orange;
border: 1px solid rgba(0, 0, 0, .3);
vertical-align: top;
padding: 0px;
margin: 0 0 0 -8px;
height:25px; 
width: 40px;
}
.box .top-search button:hover { cursor: pointer;}
.box .top-search img {
display: inline-block;
position: inherit;
height: 20px;
width: 20px;
}
/* Main Page */
.main-page {
}
.main-page .main-banner {
background-color: red;
height: 200px;
}
.main-page .primary-container {
background-color: yellow;
height: 2000px;
width: 100%;
}
.main-page .primary-container .primary-left {
float: left;
width: 70%;
background-color: blue;
height: 100%;
}
.main-page .primary-container .primary-right {
float: right;
width: 30%;
height: 100%;
background-color: black;
}
.main-page .primary-container .primary-left .post-newest {
border:1px dashed green;
width: 100%;
height: 200px;
background-color: #FFC0CB;
padding: 15px 20px 15px 20px;
}
.main-page .primary-container .primary-left .post-columns .post-row {
border:1px dashed green;
width: 100%;
height: 200px;
background-color: #7F7F7F;
padding: 15px 20px 15px 20px;
}
.main-page .primary-container .primary-left .nav-primary {
width: 100%;
height: 50px;
background-color: red;
}